<ix-fake-progress-bar [loading]="isLoading()"></ix-fake-progress-bar>
<h1 mat-dialog-title>{{ 'IPMI Events' | translate }}</h1>
<div mat-dialog-content class="events-container">
  @if ((events.length || isLoading())) {
    @for (event of events; track event.id) {
      <div class="event">
        <div class="event-header">
          <div>{{ getEventDate(event) | formatDateTime }}</div>
          <div>
            {{ event.name }}
            &mdash;
            {{ event.event_direction }}
          </div>
        </div>
        <div class="event-description">
          {{ event.event }}
        </div>
      </div>
    }
  } @else {
    <ix-empty [conf]="emptyConfig"></ix-empty>
  }
</div>
<ix-form-actions mat-dialog-actions class="form-actions">
  @if (canClear) {
    <button
      mat-button
      color="warn"
      ixTest="clear"
      (click)="onClear()"
    >
      {{ 'Clear' | translate }}
    </button>
  }
  <button
    mat-button
    mat-dialog-close
    color="primary"
    ixTest="close"
  >
    {{ 'Close' | translate }}
  </button>
</ix-form-actions>
